<?php
  session_start();
  //sua ty xem the nao, sua them chut nua
  if(isset($_GET['logout'])){
      $fp = fopen("log.html", 'a');
      fwrite($fp, "<div class='msgln'><i>".$_SESSION['name']." vừa rời khỏi phòng chat .</i><br></div>");
      fclose($fp);
      
      session_destroy();
      header("Location: index.php");
  }
      
  function loginform(){
      echo '
          <div id="loginform">
          <form action="index.php" method="post">
              <h1>CHAT</h1>
              <p> Nhập tên: </p>
              <lable for="name">Name: </lable>
              <input type="text" name="name" id="name"/>
              <input type="submit" name="enter" id="enter" value="Enter"/>
          </form>
          </div>
      ';
  }
  
  if(isset($_POST['enter'])){
      if($_POST['name'] != ""){
      $_SESSION['name'] = stripslashes(htmlspecialchars($_POST['name']));
      }
      else
      {
          echo '<span class="error">Gõ tên vào hộ cái</span>';
      }
  }
?>

<html>
    <head>
        <meta charset="UTF-8">
        <title>Chat Application</title>
        <link type="text/css" rel="stylesheet" href="style.css" />
    </head>
    <body>
  <?php if(!isset($_SESSION['name'])){
     loginform();
    }
 else {
     ?>
      <div id="wrapper">
          <div id="menu">
              <p class="welcome"> Welcome, <b> <?php echo $_SESSION['name']; ?></b></p>
              <p class="logout"> <a id="exit" href="#">Exit Chat</a></p>
              <div style="clear: both"></div>    
          </div>
          
          <div id="chatbox">
              <?php
                 if(file_exists("log.html") && filesize("log.html") > 0){
                     $handel = fopen("log.html", "r");
                     $contents = fread($handel, filesize("log.html"));
                     fclose($handel);                     
                     echo $contents;
                 }
              ?>
          </div>
          
          <form name="message" action="">
              <input name="usermsg" type="text" id="usermsg" size="63"/>
              <input name="submitmsg" type="submit" id="submitmsg" value="Send"/>
          </form>
      </div>
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
        <script type="text/javascript">
            $(document).ready(function(){
                $("#exit").click(function(){
                    var exit = confirm("Bạn chắc chắn muốn thoát?");
                    if(exit === true){window.location = 'index.php?logout=true';}
                });
                
                $("#submitmsg").click(function(){	
                    var clientmsg = $("#usermsg").val();
                    $.post("post.php", {text: clientmsg});				
                    $("#usermsg").attr("value", "");                   
	        });
                
                function loadLog(){
                    var oldscrollHeight = $("#chatbox").attr("scrollHeight");
                    $.ajax({
                       url: "log.html",
                       cache: false,
                       success: function (html) {
                            $("#chatbox").html(html);                            
                            var newscrollHeight = $("#chatbox").attr("scrollHeight");
                            if(newscrollHeight > oldscrollHeight){
                                $("#chatbox").animate({ scrollTop: newscrollHeight}, 'normal');
                            }
                        }
                    });
                }                
                setInterval(loadLog,500);
            });
        </script>
        <?php
          }
        ?>
    </body>
</html>
